:root {
  color-scheme: dark;
  --arena-void: #050708;
  --arena-panel: #0b0f10;
  --arena-panel-2: #101617;
  --arena-line: #243034;
  --arena-muted: #819093;
  --arena-ink: #f2f7f5;
  --arena-green: #b8ff36;
  --arena-cyan: #55f5e8;
  --arena-danger: #ff4d6d;
  --bs-body-bg: var(--arena-void);
  --bs-body-color: var(--arena-ink);
  --bs-primary: var(--arena-green);
  --bs-primary-rgb: 184,255,54;
  --bs-secondary-bg: var(--arena-panel);
  --bs-border-color: var(--arena-line);
  --bs-link-color: var(--arena-green);
  --bs-link-hover-color: var(--arena-cyan);
  --bs-form-bg: #0a0e0f;
  --bs-tertiary-bg: #11191a;
  --bs-border-radius: 2px;
  --bs-border-radius-lg: 3px;
  --bs-border-radius-sm: 1px;
  font-family: "Segoe UI Variable", "Segoe UI", system-ui, sans-serif;
}

html.esmail-light {
  color-scheme: light;
  --arena-void: #e8eeec;
  --arena-panel: #f8fbfa;
  --arena-panel-2: #ffffff;
  --arena-line: #aebbb8;
  --arena-muted: #52615e;
  --arena-ink: #101716;
  --arena-green: #4f7800;
  --arena-cyan: #007f79;
  --bs-body-bg: var(--arena-void);
  --bs-body-color: var(--arena-ink);
  --bs-secondary-bg: var(--arena-panel);
  --bs-border-color: var(--arena-line);
  --bs-form-bg: #fff;
  --bs-tertiary-bg: #dce5e2;
}
html.esmail-light body { background-color: #e8eeec; background-image: linear-gradient(rgba(31,55,49,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(31,55,49,.05) 1px, transparent 1px); }
html.esmail-light body::before { opacity: .06; }
html.esmail-light .folder_cell { background: rgba(247,250,249,.98) !important; }
html.esmail-light .content_cell { background: rgba(232,238,236,.9); }
html.esmail-light .content_title, html.esmail-light .msg_row { background: rgba(250,252,251,.95) !important; color: #111817 !important; }
html.esmail-light .folders a, html.esmail-light .esmail-command-header p { color: #40504d !important; }
html.esmail-light .folders li:hover a { color: #101716 !important; }
html.esmail-light .card, html.esmail-light .modal-content, html.esmail-light .server_content,
html.esmail-light .compose_page, html.esmail-light .msg_text, html.esmail-light .esmail-social-form,
html.esmail-light .esmail-home-tile, html.esmail-light .esmail-media-upload { background: #f8fbfa !important; color: #101716 !important; }
html.esmail-light .form-control, html.esmail-light .form-select, html.esmail-light .esmail-social-form input { background: #fff !important; color: #101716 !important; }
html.esmail-light .esmail-theater-shell, html.esmail-light .esmail-theater-stage { background: #dfe7e4; }
html.esmail-light .esmail-media-item { background: #f8fbfa; }
html.esmail-light .esmail-command-header h1, html.esmail-light .esmail-media-item strong, html.esmail-light .esmail-theater-empty strong { color: #101716; }

html.esmail-vanta {
  --arena-void: #071b19;
  --arena-panel: #0d2925;
  --arena-panel-2: #12342e;
  --arena-line: #285149;
  --arena-muted: #91afa8;
  --arena-ink: #eff9f5;
  --arena-green: #72d7ad;
  --arena-cyan: #77c9df;
  --bs-primary: #72d7ad;
  --bs-primary-rgb: 114,215,173;
}
html.esmail-vanta body {
  background-color: #071b19;
  background-image:
    radial-gradient(circle at 15% 12%, rgba(80,167,133,.13), transparent 28%),
    radial-gradient(circle at 88% 82%, rgba(61,126,151,.1), transparent 26%);
}
html.esmail-vanta body::before { display: none; }
html.esmail-vanta .folder_cell { background: rgba(7,27,25,.97) !important; }
html.esmail-vanta .folder_cell, html.esmail-vanta .card, html.esmail-vanta .modal-content,
html.esmail-vanta .server_content, html.esmail-vanta .compose_page, html.esmail-vanta .msg_text,
html.esmail-vanta .esmail-theater-shell, html.esmail-vanta .esmail-media-item { border-radius: 14px !important; }
html.esmail-vanta .btn, html.esmail-vanta .form-control, html.esmail-vanta .form-select { border-radius: 10px !important; text-transform: none; letter-spacing: .015em; }
html.esmail-vanta .folders li { border-left: 0; border-radius: 10px; }
html.esmail-vanta .folders li:hover, html.esmail-vanta .folders li.menu_selected { box-shadow: inset 3px 0 var(--arena-green); }
html.esmail-vanta .content_title::before { border-radius: 99px; }
html.esmail-vanta .msg_row:hover { transform: none; }
html.esmail-vanta body:has(.login_form) .cypht-layout {
  background:
    radial-gradient(circle at 22% 23%, rgba(114,215,173,.14), transparent 27%),
    radial-gradient(circle at 82% 77%, rgba(119,201,223,.12), transparent 24%),
    #071b19;
}
html.esmail-vanta body:has(.login_form) .card {
  border-top-color: #72d7ad !important;
  clip-path: none;
  border-radius: 18px !important;
}
html.esmail-vanta body:has(.login_form) .card::before { content: "PRIVATE COMMUNICATIONS HOME"; color: #72d7ad; }
html.esmail-vanta .esmail-eyebrow, html.esmail-vanta .esmail-tile-kicker { letter-spacing: .18em; }
html.esmail-vanta .esmail-command-header h1 { letter-spacing: -.04em; }
html.esmail-vanta:not(.esmail-light) .app-logo,
html.esmail-vanta:not(.esmail-light) body:has(.login_form) .card img { filter: none; }

html.esmail-vanta.esmail-light {
  --arena-void: #edf5f1;
  --arena-panel: #ffffff;
  --arena-panel-2: #f6fbf8;
  --arena-line: #bdd2ca;
  --arena-muted: #526d65;
  --arena-ink: #12352d;
  --arena-green: #167b5b;
  --arena-cyan: #16758c;
}
html.esmail-vanta.esmail-light body { background-color: #edf5f1; background-image: radial-gradient(circle at 15% 12%, rgba(31,143,104,.09), transparent 28%), radial-gradient(circle at 88% 82%, rgba(22,117,140,.07), transparent 25%); }
html.esmail-vanta.esmail-light .folder_cell { background: rgba(251,253,252,.98) !important; }

html, body { min-height: 100%; background: var(--arena-void); }
body {
  background-image:
    linear-gradient(rgba(184,255,54,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(184,255,54,.025) 1px, transparent 1px);
  background-size: 42px 42px;
  letter-spacing: .01em;
}
body::before {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 9999; opacity: .22;
  background: repeating-linear-gradient(0deg, transparent 0 3px, rgba(0,0,0,.16) 3px 4px);
}
::selection { color: #020302; background: var(--arena-green); }
* { scrollbar-color: #334143 #080b0c; scrollbar-width: thin; }
.cypht-layout { background: transparent; }
.folder_cell {
  background: rgba(7,10,11,.97) !important; border-right: 1px solid var(--arena-line);
  box-shadow: 18px 0 50px rgba(0,0,0,.32);
}
.folder_list { padding-top: 0 !important; }
.menu_home {
  display: flex !important; align-items: center; height: 94px; padding: 18px 20px !important;
  border-bottom: 1px solid var(--arena-line); position: relative; overflow: hidden;
}
.menu_home::after {
  content: "ARENA"; position: absolute; left: 77px; bottom: 17px; color: var(--arena-green);
  font: 700 10px/1 "Segoe UI", sans-serif; letter-spacing: .38em;
}
html.esmail-vanta .menu_home::after { content: "PRIVATE MAIL"; }
.app-logo { width: 165px !important; max-height: 52px; object-fit: contain; object-position: left center; }
.main { padding: 20px 10px; }
.folders { gap: 4px; }
.folders li { border-left: 2px solid transparent; transition: .16s ease; }
.folders li:hover, .folders li.menu_selected {
  border-left-color: var(--arena-green); background: rgba(184,255,54,.07);
}
.folders a { color: #b8c3c2 !important; font-weight: 600; letter-spacing: .025em; }
.folders li:hover a, .folders li.menu_selected a { color: #fff !important; }
.menu-icon { color: #667477 !important; }
.folders li:hover .menu-icon { color: var(--arena-green) !important; }
.content_cell { background: rgba(5,7,8,.83); }
.content_title {
  min-height: 64px; background: rgba(10,14,15,.92) !important; border-bottom: 1px solid var(--arena-line);
  color: #fff !important; font-weight: 750; letter-spacing: .035em;
}
.content_title::before { content: ""; display: inline-block; width: 3px; height: 18px; margin-right: 10px; background: var(--arena-green); vertical-align: -3px; }
.message_list { background: transparent !important; }
.msg_row { border-bottom: 1px solid #192123 !important; background: rgba(10,14,15,.72) !important; transition: .12s ease; }
.msg_row:hover { background: #101718 !important; box-shadow: inset 3px 0 var(--arena-green); transform: translateX(1px); }
.msg_row.unread { background: rgba(184,255,54,.055) !important; }
.msg_row.unread .subject { color: #fff !important; font-weight: 750; }
.card, .modal-content, .server_content, .settings_subtitle, .compose_page, .msg_text {
  background: var(--arena-panel) !important; border: 1px solid var(--arena-line) !important; box-shadow: 0 22px 70px rgba(0,0,0,.28);
}
.btn { border-radius: 2px !important; font-weight: 750; letter-spacing: .05em; text-transform: uppercase; font-size: .77rem; }
.btn-primary {
  color: #061005 !important; background: var(--arena-green) !important; border-color: var(--arena-green) !important;
  box-shadow: 0 0 22px rgba(184,255,54,.13);
}
.btn-primary:hover { background: #d0ff75 !important; }
.btn-secondary { background: #172021 !important; border-color: #344245 !important; }
.form-control, .form-select {
  background: #080c0d !important; border: 1px solid #334143 !important; color: #f5f8f7 !important;
  border-radius: 2px !important; box-shadow: none !important;
}
.form-control:focus, .form-select:focus { border-color: var(--arena-green) !important; box-shadow: 0 0 0 2px rgba(184,255,54,.1) !important; }
.badge { border-radius: 2px !important; }

body:has(.login_form) .cypht-layout {
  min-height: 100vh; display: grid; place-items: center; position: relative; overflow: hidden;
  background:
    radial-gradient(circle at 72% 28%, rgba(85,245,232,.08), transparent 24%),
    radial-gradient(circle at 18% 76%, rgba(184,255,54,.08), transparent 22%);
}
body:has(.login_form) .cypht-layout::before {
  content: "E’S‑MAIL"; position: absolute; top: 7vh; left: 7vw; font-weight: 900; font-size: clamp(2rem,7vw,7rem);
  letter-spacing: -.07em; color: rgba(255,255,255,.025); transform: skewX(-8deg);
}
body:has(.login_form) .card {
  max-width: 480px !important; padding: 34px !important; border-top: 3px solid var(--arena-green) !important;
  clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 22px 100%, 0 calc(100% - 22px));
}
body:has(.login_form) .card::before {
  content: "SECURE ACCESS // ARENA"; display: block; color: var(--arena-green); font-size: 11px; font-weight: 800; letter-spacing: .28em; margin-bottom: 18px;
}
body:has(.login_form) .card img { width: 74% !important; max-height: 90px; }

.esmail-server-msgs {
  position: relative; z-index: 40; width: min(480px, calc(100% - 32px)); margin: 12px auto 0;
  padding: 12px 14px; border: 1px solid #c45b5b; background: #3a1518; color: #ffd6d6;
  font-size: 14px; font-weight: 600;
}
.esmail-server-msg { margin: 0 0 6px; }
.esmail-server-msg:last-child { margin: 0; }
body:has(.login_form) .esmail-server-msgs { margin-bottom: 16px; }

.esmail-command-page { padding: clamp(18px,3vw,42px); max-width: 1420px; margin: 0 auto; }
.esmail-command-header { display: flex; justify-content: space-between; align-items: end; gap: 30px; border-bottom: 1px solid var(--arena-line); padding-bottom: 25px; margin-bottom: 24px; }
.esmail-eyebrow, .esmail-tile-kicker { color: var(--arena-green); font-size: 10px; font-weight: 850; letter-spacing: .28em; }
.esmail-command-header h1 { margin: 8px 0 8px; font-size: clamp(2rem,4vw,4.4rem); line-height: .95; max-width: 830px; letter-spacing: -.055em; }
.esmail-command-header p { color: #9caaa9; max-width: 700px; margin: 0; }
.esmail-status { color: #a8b4b3; font-size: 10px; font-weight: 800; letter-spacing: .16em; white-space: nowrap; }
.esmail-status i { display: inline-block; width: 7px; height: 7px; background: var(--arena-green); margin-right: 8px; box-shadow: 0 0 12px var(--arena-green); }
.esmail-provider-rail { display: grid; grid-template-columns: repeat(5,1fr); gap: 10px; margin-bottom: 18px; }
.esmail-provider-rail button {
  --service-accent: #38c995;
  position: relative; min-height: 128px; padding: 0 !important; overflow: hidden;
  color: #ecf5f2; background: linear-gradient(145deg, color-mix(in srgb,var(--service-accent) 20%,#080d0d),#070a0b 72%);
  border: 1px solid color-mix(in srgb,var(--service-accent) 52%,#263532) !important;
  border-radius: 12px; font-weight: 750; text-align: left; isolation: isolate;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.esmail-provider-rail button::after {
  content: ""; position: absolute; inset: auto -25% -60% 18%; height: 120px; z-index: -1;
  background: radial-gradient(circle,color-mix(in srgb,var(--service-accent) 35%,transparent),transparent 68%);
}
.esmail-service-art { display: grid; place-items: center; height: 78px; background: rgba(0,0,0,.2); border-bottom: 1px solid rgba(255,255,255,.09); }
.esmail-service-art img { width: 42px; height: 42px; object-fit: contain; filter: brightness(0) invert(1); }
.esmail-service-art span { font-size: 30px; font-weight: 900; letter-spacing: -.06em; color: #fff; }
.esmail-service-art img + span { display: none; }
.esmail-service-copy { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 7px; padding: 11px 12px; }
.esmail-service-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.esmail-service-copy small { color: color-mix(in srgb,var(--service-accent) 80%,white); font-size: 8px; letter-spacing: .12em; }
.esmail-provider-rail button.service-esmail-tv { grid-column: span 2; min-height: 176px; background-position: center; background-size: cover; }
.esmail-provider-rail button.service-esmail-tv .esmail-service-art { height: 124px; background: url("assets/esmail-tv-channel.png") center/cover no-repeat; }
.esmail-provider-rail button.service-esmail-tv .esmail-service-art img,
.esmail-provider-rail button.service-esmail-tv .esmail-service-art span { display: none; }
.esmail-provider-rail button:last-child { border-right: 0; }
.esmail-provider-rail button:hover, .esmail-provider-rail button:focus {
  color: #fff; transform: translateY(-2px); border-color: var(--service-accent) !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.36), 0 0 24px color-mix(in srgb,var(--service-accent) 22%,transparent);
}
.esmail-social-form { background: var(--arena-panel); border: 1px solid var(--arena-line); padding: 20px; margin-bottom: 18px; }
.esmail-social-form label { display: block; color: var(--arena-green); font-size: 10px; font-weight: 800; letter-spacing: .22em; margin-bottom: 9px; }
.esmail-social-form > div { display: flex; }
.esmail-social-form input { flex: 1; min-width: 0; height: 50px; background: #050708; border: 1px solid #334143; border-right: 0; padding: 0 16px; color: #fff; }
.esmail-social-form button { min-width: 165px; background: var(--arena-green); color: #061005; border: 0; font-weight: 850; text-transform: uppercase; letter-spacing: .05em; }
.esmail-social-form small { display: block; color: var(--arena-muted); margin-top: 10px; }
.esmail-theater-shell { border: 1px solid var(--arena-line); background: #030505; min-height: 520px; }
.esmail-theater-top { height: 48px; display: flex; align-items: center; justify-content: space-between; padding: 0 16px; border-bottom: 1px solid var(--arena-line); color: var(--arena-muted); font-size: 10px; font-weight: 800; letter-spacing: .16em; }
.esmail-theater-top a { color: var(--arena-green); }
.esmail-theater-top a.disabled { pointer-events: none; color: #4f5a5c; }
.esmail-theater-stage { min-height: 470px; display: grid; place-items: center; padding: 24px; overflow: auto; }
.esmail-theater-stage iframe { width: min(100%, 680px); min-height: 420px; border: 0; background: #fff; }
.esmail-theater-empty { display: flex; flex-direction: column; text-align: center; color: var(--arena-muted); gap: 9px; }
.esmail-theater-empty i { color: var(--arena-green); font-size: 38px; }
.esmail-theater-empty strong { color: #eaf0ee; font-size: 1.15rem; }
.esmail-tv-launch { position: relative; width: min(960px,100%); min-height: 430px; overflow: hidden; border: 1px solid #35695d; background: #020706; }
.esmail-tv-launch img { display: block; width: 100%; height: 100%; min-height: 430px; object-fit: cover; opacity: .72; }
.esmail-tv-launch > div { position: absolute; inset: auto 0 0; padding: clamp(22px,5vw,48px); background: linear-gradient(transparent,rgba(0,0,0,.96)); }
.esmail-tv-launch h2 { margin: 0 0 6px; font-size: clamp(2rem,5vw,4rem); }
.esmail-tv-launch p { color: #b6c7c2; }
.esmail-tv-launch a { display: inline-flex; align-items: center; gap: 8px; padding: 11px 15px; color: #061005; background: var(--arena-green); font-weight: 850; text-decoration: none; }
.esmail-github-card { width: min(760px,100%); display: flex; gap: 28px; padding: 34px; background: #0a0f10; border: 1px solid #2b383a; border-left: 3px solid var(--arena-green); }
.esmail-github-card img { width: 120px; height: 120px; object-fit: cover; filter: saturate(.75); }
.esmail-github-card span { color: var(--arena-green); font-size: 10px; font-weight: 800; letter-spacing: .2em; }
.esmail-github-card h2 { margin: 7px 0; font-size: 2rem; }
.esmail-github-card p { color: #a7b3b1; }
.esmail-privacy-note { display: flex; gap: 14px; margin-top: 16px; padding: 16px; border: 1px solid #293638; color: var(--arena-muted); }
.esmail-privacy-note i { color: var(--arena-cyan); font-size: 22px; }
.esmail-privacy-note strong, .esmail-privacy-note span { display: block; }
.esmail-privacy-note strong { color: #dfe8e6; }
.esmail-home-tile { display: inline-flex; flex-direction: column; width: min(360px,100%); min-height: 170px; padding: 25px; margin: 24px; border: 1px solid var(--arena-line); border-top: 2px solid var(--arena-green); background: var(--arena-panel); color: var(--arena-ink) !important; text-decoration: none; }
.esmail-home-tile strong { font-size: 1.55rem; margin: 20px 0 6px; }
.esmail-home-tile span:last-child { color: var(--arena-muted); }
.esmail-media-upload { display: grid; grid-template-columns: 1fr auto; gap: 12px; padding: 20px; margin-bottom: 18px; border: 1px solid var(--arena-line); background: var(--arena-panel); }
.esmail-media-upload input[type=file] { position: absolute; opacity: 0; pointer-events: none; }
.esmail-media-upload label { display: flex; align-items: center; gap: 14px; min-height: 62px; padding: 0 18px; border: 1px dashed #465658; cursor: pointer; }
.esmail-media-upload label:hover { border-color: var(--arena-green); background: rgba(184,255,54,.035); }
.esmail-media-upload label i { color: var(--arena-green); font-size: 24px; }
.esmail-media-upload label strong, .esmail-media-upload label span { display: block; }
.esmail-media-upload label span { margin-left: auto; color: var(--arena-muted); font-size: 11px; }
.esmail-vault-grid { display: grid; gap: 8px; }
.esmail-media-item { display: grid; grid-template-columns: 58px 1fr auto; align-items: center; gap: 15px; min-height: 84px; padding: 13px 16px; border: 1px solid var(--arena-line); background: #090d0e; }
.esmail-media-icon { display: grid; place-items: center; width: 52px; height: 52px; border: 1px solid #334143; color: var(--arena-green); font-size: 22px; }
.esmail-media-item span { display: block; color: var(--arena-green); font-size: 9px; font-weight: 850; letter-spacing: .18em; }
.esmail-media-item strong, .esmail-media-item small { display: block; }
.esmail-media-item small { color: var(--arena-muted); margin-top: 4px; }
.esmail-media-actions, .esmail-media-actions form { display: flex; gap: 7px; margin: 0; }
.esmail-vault-empty { min-height: 260px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; border: 1px solid var(--arena-line); color: var(--arena-muted); }
.esmail-vault-empty i { color: var(--arena-green); font-size: 36px; }
.esmail-vault-empty strong { color: #edf3f1; }
.esmail-voice-dock { position: fixed; right: 22px; bottom: 20px; z-index: 1200; display: flex; background: rgba(5,8,9,.96); border: 1px solid #344245; box-shadow: 0 16px 45px rgba(0,0,0,.45); }
.esmail-voice-dock button { display: flex; gap: 7px; align-items: center; min-height: 42px; padding: 0 13px; color: #bdc8c6; background: transparent; border: 0; border-right: 1px solid #253033; font-size: 11px; font-weight: 750; text-transform: uppercase; }

/* Animated Visual Worlds stay behind the authenticated application and login card. */
#esmail-vanta-background {
  position: fixed; inset: 0; z-index: 0; pointer-events: none; opacity: .52;
  background: radial-gradient(circle at 20% 20%, #164238, #020706 62%);
}
#esmail-vanta-background canvas { width: 100% !important; height: 100% !important; }
.cypht-layout, .esmail-signup-page { position: relative; z-index: 1; }
.folder_cell, .content_cell { position: relative; z-index: 1; }
.esmail-vanta-picker { position: fixed; left: 18px; bottom: 18px; z-index: 1250; }
.esmail-vanta-toggle {
  display: flex; align-items: center; gap: 8px; min-height: 42px; padding: 0 14px;
  color: var(--arena-ink); background: rgba(6,12,12,.94); border: 1px solid var(--arena-line);
  border-radius: 10px; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase;
  box-shadow: 0 14px 35px rgba(0,0,0,.4);
}
.esmail-vanta-toggle i { color: var(--arena-green); }
.esmail-vanta-options {
  position: absolute; left: 0; bottom: 50px; width: min(390px,calc(100vw - 36px)); max-height: min(620px,76vh);
  overflow: auto; padding: 14px; color: var(--arena-ink); background: rgba(5,11,11,.98);
  border: 1px solid var(--arena-line); border-radius: 14px; box-shadow: 0 22px 70px rgba(0,0,0,.55);
}
.esmail-vanta-picker-head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 10px; }
.esmail-vanta-picker-head span { color: var(--arena-green); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.esmail-vanta-options > label { display: flex; gap: 9px; align-items: center; margin: 8px 0 13px; color: var(--arena-muted); font-size: 12px; }
.esmail-vanta-preset-list { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.esmail-vanta-preset {
  display: grid; grid-template-columns: 10px 1fr; grid-template-rows: auto auto; gap: 0 8px; text-align: left;
  padding: 10px; color: #dce8e5; background: #091110; border: 1px solid #263836; border-radius: 8px; font-size: 12px;
}
.esmail-vanta-preset > span { grid-row: 1 / 3; align-self: stretch; background: linear-gradient(#72d7ad,#193b42); border-radius: 8px; }
.esmail-vanta-preset small { color: #78928c; font-size: 8px; letter-spacing: .12em; }
.esmail-vanta-preset:hover, .esmail-vanta-preset.selected { border-color: var(--arena-green); background: rgba(114,215,173,.1); }
.esmail-display-mode { z-index: 1250 !important; }
.esmail-signup-invite { position: relative; z-index: 2; display: flex; justify-content: center; gap: 7px; margin: -16px auto 18px; font-size: 13px; }
.esmail-signup-invite span { color: var(--arena-muted); }
.esmail-signup-invite a { color: var(--arena-green); font-weight: 800; }

.esmail-signup-page { min-height: 100vh; display: grid; place-items: center; padding: 30px; }
.esmail-signup-card { width: min(620px,100%); padding: clamp(25px,5vw,48px); background: rgba(6,14,13,.96); border: 1px solid var(--arena-line); border-top: 3px solid var(--arena-green); border-radius: 18px; box-shadow: 0 28px 90px rgba(0,0,0,.5); }
.esmail-signup-card .esmail-eyebrow { display: block; margin-bottom: 10px; }
.esmail-signup-card h1 { margin: 0 0 7px; font-size: clamp(2rem,6vw,3.7rem); letter-spacing: -.055em; }
.esmail-signup-card > p { color: var(--arena-muted); }
.esmail-signup-form { display: grid; gap: 14px; margin-top: 24px; }
.esmail-signup-form label { color: #dce7e4; font-size: 12px; font-weight: 750; }
.esmail-signup-form input[type=text], .esmail-signup-form input[type=password] { width: 100%; min-height: 48px; margin-top: 6px; padding: 0 13px; }
.esmail-signup-form .esmail-consent { display: grid; grid-template-columns: auto 1fr; gap: 10px; color: var(--arena-muted); line-height: 1.45; }
.esmail-signup-form button { min-height: 50px; }
.esmail-signup-login { margin: 17px 0 0; text-align: center; }
.esmail-signup-login a { color: var(--arena-green); font-weight: 800; }

.esmail-controls-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.esmail-control-card { padding: 22px; background: var(--arena-panel); border: 1px solid var(--arena-line); border-top: 2px solid var(--arena-green); }
.esmail-control-card > i { color: var(--arena-green); font-size: 26px; }
.esmail-control-card h2 { margin: 13px 0 6px; }
.esmail-control-card p { color: var(--arena-muted); min-height: 48px; }
.esmail-control-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.esmail-notice-preview { margin-top: 18px; padding: 18px; border: 1px solid var(--arena-line); background: rgba(4,9,9,.9); }
.esmail-notice-preview strong { display: block; color: var(--arena-green); margin-bottom: 7px; }
.esmail-notice-preview p { margin: 0; color: var(--arena-muted); white-space: pre-wrap; }

.esmail-platform-toolbar { display: grid; grid-template-columns: 1fr auto; gap: 10px; margin-bottom: 12px; }
.esmail-platform-toolbar input { min-height: 46px; padding: 0 14px; }
.esmail-provider-rail { grid-template-columns: repeat(6,minmax(0,1fr)); max-height: 265px; overflow: auto; }
.esmail-provider-rail { grid-template-columns: repeat(5,minmax(0,1fr)); max-height: 520px; padding: 1px; }
.esmail-provider-rail button.active { border-color: var(--arena-green) !important; box-shadow: inset 0 0 0 2px var(--arena-green); }
.esmail-custom-platform { display: grid; grid-template-columns: 1fr 1.5fr auto; gap: 8px; padding: 14px; margin-bottom: 18px; border: 1px solid var(--arena-line); background: var(--arena-panel); }
.esmail-custom-platform input { min-height: 42px; padding: 0 12px; }
.esmail-service-launcher { width: min(780px,100%); padding: 34px; text-align: left; background: #08100f; border: 1px solid #2d403d; border-left: 4px solid var(--arena-green); }
.esmail-service-launcher i { color: var(--arena-green); font-size: 32px; }
.esmail-service-launcher h2 { margin: 12px 0 6px; }
.esmail-service-launcher p { color: var(--arena-muted); }
.esmail-launch-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 18px; }
.esmail-launch-actions a { padding: 10px 14px; color: #061005; background: var(--arena-green); font-weight: 800; text-decoration: none; }
.esmail-launch-actions a:last-child { color: #dce8e5; background: #15201f; border: 1px solid #344743; }
.esmail-tv-home-tile { background: linear-gradient(rgba(4,12,10,.45),rgba(4,12,10,.95)),url("assets/esmail-tv-channel.png") center/cover !important; min-height: 230px; }
.esmail-tv-home-tile strong, .esmail-tv-home-tile span:last-child { color: #fff; text-shadow: 0 2px 12px #000; }
.esmail-tv-hero { position: relative; min-height: min(620px,62vw); overflow: hidden; border: 1px solid #315e55; background: #020706; box-shadow: 0 26px 80px rgba(0,0,0,.38); }
.esmail-tv-hero > img, .esmail-tv-hero > iframe { display: block; width: 100%; min-height: min(620px,62vw); border: 0; object-fit: cover; }
.esmail-tv-overlay { position: absolute; inset: auto 0 0; padding: clamp(24px,5vw,60px); color: #fff; background: linear-gradient(transparent,rgba(0,5,4,.97)); pointer-events: none; }
.esmail-tv-overlay > span { color: var(--arena-green); font-size: 10px; font-weight: 850; letter-spacing: .3em; }
.esmail-tv-overlay h2 { margin: 9px 0 5px; font-size: clamp(2rem,5vw,5rem); letter-spacing: -.055em; }
.esmail-tv-overlay p { max-width: 760px; color: #c0ceca; }
.esmail-tv-overlay code { color: var(--arena-cyan); }
.esmail-tv-panels { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-top: 16px; }
.esmail-tv-panels article { display: flex; flex-direction: column; min-height: 175px; padding: 22px; border: 1px solid var(--arena-line); background: var(--arena-panel); }
.esmail-tv-panels i { color: var(--arena-green); font-size: 27px; }
.esmail-tv-panels strong { margin: 13px 0 5px; font-size: 1.05rem; }
.esmail-tv-panels span { color: var(--arena-muted); }
.esmail-tv-panels a { margin-top: auto; padding-top: 12px; color: var(--arena-green); font-weight: 800; }

@media (max-width: 800px) {
  html, body, .cypht-layout, .content_cell, .content_cell > .row { min-width: 0 !important; width: 100% !important; max-width: 100% !important; }
  body { overflow-x: hidden; }
  .esmail-controls-grid { grid-template-columns: 1fr; }
  .esmail-provider-rail { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .esmail-custom-platform { grid-template-columns: 1fr; }
  .esmail-vanta-picker { left: 9px; bottom: 9px; }
  .esmail-tv-panels { grid-template-columns: 1fr; }
}
.esmail-voice-dock button:hover, .esmail-voice-dock button.active { color: #061005; background: var(--arena-green); }
.esmail-voice-dock button.unavailable { color: var(--arena-danger); }
.esmail-display-mode { position: fixed; right: 22px; bottom: 70px; z-index: 1200; width: 42px; height: 42px; border: 1px solid #344245; background: rgba(5,8,9,.96); color: var(--arena-green); }
html.esmail-light .esmail-display-mode { background: #f8fbfa; border-color: #9caaa7; }
@media (max-width: 780px) {
  .esmail-command-header { display: block; }
  .esmail-status { display: block; margin-top: 16px; }
  .esmail-provider-rail { grid-template-columns: repeat(2,1fr); }
  .esmail-provider-rail button.service-esmail-tv { grid-column: span 2; }
  .esmail-social-form > div { display: block; }
  .esmail-social-form input, .esmail-social-form button { width: 100%; border: 1px solid #334143; }
  .esmail-social-form button { min-height: 48px; margin-top: 8px; }
  .esmail-github-card { display: block; }
  .esmail-github-card img { margin-bottom: 20px; }
  .esmail-media-upload { grid-template-columns: 1fr; }
  .esmail-media-upload label { display: block; padding: 16px; }
  .esmail-media-upload label span { margin-top: 5px; }
  .esmail-media-item { grid-template-columns: 48px 1fr; }
  .esmail-media-actions { grid-column: 1 / -1; }
  .esmail-voice-dock span { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}
